<template>
	<view>
		<form class="flowform" @submit="submit">
			<view class="formlist inputtext">
				<view class="formgroup border-bottom-E3E3E5">
					<view class="labletitle">
						<label>日志标题</label>
						<text class="required" v-show="required">*</text>
					</view>
					<view class="controlvalue">
						<input type="text" v-model="worklog.title" name="title" :disabled="!disabled" placeholder="输入" />
					</view>
				</view>
			</view>
			<view class="formlist">
				<view class="formgroup padding-17 border-bottom-E3E3E5">
					<view class="labletitletar">
						<label>今日内容</label>
						<text class="required" v-show="required">*</text>
					</view>
					<view class="controlvalue  uni-textarea">
						<textarea v-model="worklog.todayContent" name="todayContent" maxlength="500" :disabled="!disabled" placeholder="输入" />
						</view>
				</view>
			</view>
			<view class="formlist">
				<view class="formgroup padding-17 border-bottom-E3E3E5">
					<view class="labletitletar">
						<label>明日内容</label>
						<text class="required" v-show="required">*</text>
					</view>
					<view class="controlvalue  uni-textarea">
						<textarea v-model="worklog.tomorrowContent" name="tomorrowContent" maxlength="500" :disabled="!disabled" placeholder="输入"/>
					</view>
				</view>
			</view>
			<view class="formlist">
				<view class="formgroup padding-17 border-bottom-E3E3E5">
					<view class="labletitletar">
						<label>遇到问题</label>
						<text class="required" v-show="required">*</text>
					</view>
					<view class="controlvalue  uni-textarea">
						<textarea v-model="worklog.question" name="question" maxlength="500" :disabled="!disabled" placeholder="输入"/>
					</view>
				</view>
			</view>
			<!-- 选择用户弹窗 -->
			<view class="formlist inputtext" @tap="toUserId">
				<view class="formgroup border-bottom-E3E3E5">
					<view class="labletitle">
						<label>发送给谁</label>
						<text class="required" v-show="required">*</text>
					</view>
					<view class="controlvalue">
						<input type="text" v-model="worklog.toUserId" name="toUserId" placeholder="选择" :disabled="!disabled" />
					</view>
					<view class="advanceicon iconfont icon-xiangyou"></view>
				</view>
			</view>
			
			<view class="buttom-box">
				<view class="flow-button">
					<button class="btn-same btn-submit" form-type="submit" v-if="isShow">保存</button>
				</view>
			</view>
		</form>
		<tki-tree ref="tree" :range="treelist" :multiple="multiple" :selectParent="selectParent" rangeKey="fullName"></tki-tree>
	</view>
</template>

<script>
	import helper from '@/common/js/helper.js'
	import jnpf from '@/common/js/jnpf.js'
	import tkiTree from '@/components/tki-tree/tki-tree.vue'
	import graceChecker from '@/common/js/graceChecker.js'
	let rule = [{
			name: "title",
			checkType: "notnull",
			checkRule: "",
			errorMsg: "标题不能为空"
		},
		{
			name: "todayContent",
			checkType: "notnull",
			checkRule: "",
			errorMsg: "今日内容：必填"
		},
		{
			name: "tomorrowContent",
			checkType: "notnull",
			checkRule: "",
			errorMsg:"明日内容：必填"
		},
		{
			name: "toUserId",
			checkType: "notnull",
			checkRule: "",
			errorMsg: "选择发送人"
		},
		{
			name: "question",
			checkType: "notnull",
			checkRule: "",
			errorMsg: "遇到问题：必填"
		},
	];
	export default {
		components: {
			tkiTree
		},
		data() {
			return {
				worklog:{
					title:jnpf.userInfo().realName+'的日志',
					todayContent:'',
					tomorrowContent:'',
					question:'',
					toUserId:'',
					userIds:''
				},
				multiple: false, //多选
				selectParent: false, //父级可选
				treelist:[],
				toUserIdList:[],
				disabled:false,
				required: true,
				isShow: false,
			}
		},
		onBackPress() {
			uni.removeStorageSync('TabCur3')
		},
		onLoad(e) {
			/* 根据状态禁用表单 */
			let TabCur3 = uni.getStorageSync('TabCur3')
			
			if(!e.id || TabCur3 == 0 || !TabCur3){
				this.isShow = true
				this.disabled = true
			}else if(TabCur3 == 1){
				this.isShow = false
				this.disabled = false
			}
			
			
			if (Object.prototype.hasOwnProperty.call(e, 'id')) {
				helper.ajax({
					url: '/api/Extend/WorkLog/' + e.id,
					success: res => {
						// console.log(res)
						let _worklog = res.data.data
						this.worklog = _worklog;
					}
				});
				uni.setNavigationBarTitle({
					title: "日志编辑"
				});
			}
			/* 用户树控件数据 */
			helper.ajax({
				url: '/api/Permission/Users/Selector',
				success: res => {
					this.toUserIdList = res.data.data.list;
					
				}
			});
		},
		methods: {
			// 选择用户弹窗 
			toUserId() {
				this.treelist = this.toUserIdList;
				this.multiple = true;
				this.selectParent = false;
				if(this.disabled){
					this.$refs.tree._show();
				}
				
				this.$eventHub.$off('treemodality');
				this.$eventHub.$on('treemodality', (data) => {
					let toUserName = new Array()
					let toUserIds = new Array()
					for (let i = 0; i < data.length; i++) {
						toUserName.push(data[i].fullName);
						toUserIds.push(data[i].id);
					}
					this.worklog.toUserId = toUserName.toString();
					this.worklog.userIds = toUserIds.toString();
					this.$eventHub.$off('treemodality');
				});
			},
			/* 提交 */
			submit(e){
				var formData=this.worklog;
				formData.toUserId=this.worklog.userIds;
				if (! graceChecker.check(formData, rule)) {
					helper.msg(graceChecker.error);
					return;
				}
				let url = "/api/Extend/WorkLog";
				let method = "POST";
				if(formData.id){
					url = url+"/"+formData.id;
					method="PUT";
				}
				helper.ajax({
					url: url,
					method: method,
					contentType:"application/json",
					data: formData,
					success: res => {
						helper.msg(res.data.msg,'success');
						uni.navigateBack();
					}
				});
			}
		}
	}
</script>

<style>
	.required{
		color: red;
	}
	.btn-submit{
		width: 100%;
	}
</style>
